<template>
    <button @click="toBackAc">返回</button>
    <button @click="toAc3">去页面3</button>
    <button @click="changeMsg">改变当前页面值</button>
    <div>{{mCurrentMsg}}</div>
</template>
<script setup lang="ts">
import { getCurrentInstance, ref } from 'vue';
import { useRoute, useRouter } from "vue-router";
// import { useRouter } from 'vue-router'
// import mRouterInstance from '@/router/index'
import { onBeforeRouteLeave, onBeforeRouteUpdate, type NavigationGuardNext, type RouteLocationNormalized } from 'vue-router';
let mRouterInstance = useRouter()
const mCurrentMsg = ref("页面2：")
const toBackAc = () => {
    // mKeepAlive.setFalse()
    mRouterInstance.back()
}
const toAc3 = () => {
    mRouterInstance.replace({
        name: "TestRouter3Ac"
    })
}
const changeMsg = () => {
    mCurrentMsg.value = mCurrentMsg.value + "改变后"
}
console.log("ac1111");

// onBeforeRouteLeave(async (to: RouteLocationNormalized, from: RouteLocationNormalized, next: NavigationGuardNext) => {
//     console.log("to:", to.name, "form:", from.name, "next:", next);
// })
onBeforeRouteUpdate(async (to: RouteLocationNormalized, from: RouteLocationNormalized) => {
    // console.log("Update2 to:", to, "form:", from);
})
onBeforeRouteLeave(async (to: RouteLocationNormalized, from: RouteLocationNormalized) => {
    // console.log("currentRoute2 to:", mRouterInstance.currentRoute.value);
    // from.query.keepAlive = "true"
    // mRouterInstance.currentRoute.value.query.keepAlive = "true"
    // console.log("currentRoute2 to:", mRouterInstance.currentRoute.value);
    // console.log("Leave2 to:", to, "form:", from);
    // console.log('next', next);

    // next({
    //     path: to.path,
    //     query: { keepAlive: 'true' }
    // })
})
</script>
<style scoped>

</style>